<!DOCTYPE html >
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="keywords"  content = "图书 java jsp"/>
    <meta http-equiv="author" content="phenix"/>
<!--    <link rel="stylesheet" type="text/css" href="/library-demo1/css/skin.css" />-->
    <script src="/js/jquery-3.5.1.js"></script>
    <style>
        body{
            background-color: #737383;
            /*background: url("/img/bg3.jpg");*/
        }
        .input-bookmsg{
            background-color: gainsboro;
            width: 500px;
            height: 500px;
            margin-left: 30%;
            margin-top: 30px;
        }
        .bth{
            box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
            background-color: gray; /* Green */
            border: none;
            color: white;
            padding: 8px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            border-radius: 5px;

        }
        .input-bookmsg{
            border-radius: 20px;
            text-align: center;
            line-height: 40px;
        }

    </style>



</head>
<body>
<div class="input-bookmsg">
    <form>


    图书名称：<input type="text" id="book-name"><br/>
    图书价值：<input type="text" id="book-price" ><br/>
    图书借阅单价：<input type="text" id="book-borrow-price"><br/>
    图书作者：<input type="text" id="book-author" ><br/>
    图书出版社：<input type="text" id="book-press"><br/>
    图书出版日期：<input type="text" id="book-public-date" ><br/>
    图书原始库存：<input type="text" id="book-originalstock"><br/>
    图书存放位置：<input type="text" id="book-address"><br/>
    图书编号：<input type="text" id="book-num"><br/>
    图书类型：
    <select name="book-type" id="book-type"  >
        <option >请选择</option>
        <option value="1">言情</option>
        <option value="2">信息技术</option>
        <option value="14" >小说</option>
        <option value="15">社会科学</option>
        <option value="16">经济管理</option>
        <option value="17">文艺金典</option>
    </select>
    </form>
    <input type="button" id="sub-book-msg"  class="bth" value="提交"/>
    <h2 id="suss"></h2>

</div>

</body>
</html>
<script>
    $(function (){
        $("#sub-book-msg").click(function (){
            let bookName=$("#book-name").val();
            let bookPrice=$("#book-price").val();
            let bookBorrowPrice=$("#book-borrow-price").val();
            let bookAuthor=$("#book-author").val();
            let bookPress=$("#book-press").val();
            let bookPubDate=$("#book-public-date").val();
            let bookOriginalStock=$("#book-originalstock").val();
            let bookTYpe=$("#book-type").val();
            let bookaddress=$("#book-address").val();
            let booknum=$("#book-num").val();
            console.log(booknum)




            // let  file = document.querySelector('input[type=file]').files[0];
            // let  reader = new FileReader();
            // reader.readAsDataURL(file);
            // console.log(reader.readAsDataURL(file))
            // let fileBase=reader.readAsDataURL(file);
            // console.log(fileBase)
            //"?bookName="+bookName+"&bookPrice="+bookPrice
            // +"bookBorrowPrice"+bookBorrowPrice,bookAuthor,bookPress,bookPubDate,bookOriginalStock,bookTYpe,fileBase
            $.post("/books-add.admin","bookName="+bookName+"&bookPrice="+bookPrice+"&bookBorrowPrice="+bookBorrowPrice+"&bookAuthor="+bookAuthor+"&bookPress="+bookPress+"&bookPubDate="+bookPubDate+"&bookOriginalStock="+
                bookOriginalStock+"&bookTYpe="+bookTYpe
                +"&bookaddress="+bookaddress+"&booknum="+booknum,function (text) {
                if(text){
                    $("#suss").css("display","red").html("添加成功")
                        $(':input','form')
                            .not(':button, :submit, :reset, :hidden')
                            .val('')
                            .removeAttr('checked')
                            .removeAttr('selected');
                }else {
                    $("#suss").css("display","red").html("添加失败")
                }



            })
        })
    })

</script>
